<!DOCTYPE html>
<html>
	<head>
		<!-- 字符编码 -->
		<meta charset="utf-8">
		<!-- 定义适配移动端屏幕比例代码 -->
		<meta name="viewport"
			content="width=device-width,user-scalable=no,inital-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/style.css" /> 
		<script src="js/banner.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<ul class="cm">
			<li><a href="#">置顶</a></li>
			<li><a href="#mszs">美食展示</a></li>
		</ul>
		<div class="header">
			<div class="header-f">
				<div class="logo">
					<img src="images/logo.png">
				</div>
				<div class="nav">
					<ul class="userNav">
						<li>
							<a style="color: #FF0000;" href="index.html">首页</a>
						</li>
						<li>
							<a href="cp.html">烹饪食谱</a>
						</li>
						<li>
							<a href="cs.html">经验分享</a>
						</li>
						<li>
							<a href="LiuYan.html">留言建议</a>
						</li>
						<li class="wdl">
							<a href="login.html">登录注册</a>
						</li>
						<li class="drcg" style="display: none;"><a href="#"></a></li>
						<li class="drcg tuiChu" style="display: none;"><a href="#">退出登录</a></li>
					</ul>
					<ul class="adminNav" style="display: none;">
						<li>
							<a style="color: #FF0000;" href="userDB.html">用户管理</a>
						</li>
						<li class="wdl">
							<a href="login.html">登录注册</a>
						</li>
						<li class="drcg" style="display: none;"><a href="#"></a></li>
						<li class="drcg tuiChu" style="display: none;"><a href="#">退出登录</a></li>
					</ul>
				</div>
			</div>
		</div>
		<div class="swiper">
			<!-- 轮播图 -->
			<div id="wrap" class="wrap">
				<ul id="pic">
					<li><img src="images/ban1.jpg" alt="" /></li>
					<li><img src="images/ban2.jpg" alt="" /></li>
					<li><img src="images/ban3.jpg" alt="" /></li>
				</ul>
				<ol id="list">
					<li class="on">1</li>
					<li>2</li>
					<li>3</li>
				</ol>
			</div>
		</div>
		<div class="title-three">
			<h3 id="mszs">美食展示</h3>
		</div>
		<div class="list">
			<ul>
				<li>
					<a href="#">
						<img src="images/v1.jpg" alt="">
						<p>重庆火锅</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v2.jpg" alt="">
						<p>北京烤鸭</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v3.jpg" alt="">
						<p>成都串串香</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v4.jpg" alt="">
						<p>重庆酸辣粉</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v5.jpg" alt="">
						<p>武汉热干面</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v6.jpg" alt="">
						<p>西安肉夹馍</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v7.jpg" alt="">
						<p>长沙口味虾</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v8.jpg" alt="">
						<p>广东肠粉</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v9.jpg" alt="">
						<p>苏州小笼包</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v10.jpg" alt="">
						<p>中国香港菠萝包</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v11.jpg" alt="">
						<p>陕西牛羊肉泡馍</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v12.jpg" alt="">
						<p>长沙臭豆腐</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v13.jpg" alt="">
						<p>常德牛肉米粉</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v14.jpg" alt="">
						<p>湖南酱板鸭</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v15.jpg" alt="">
						<p>山东煎饼</p>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/v16.jpg" alt="">
						<p>山西刀削面</p>
					</a>
				</li>
			</ul>
		</div>
		<div class="footer">
			<p>姓名:黎训斌 学号:0223610 班级:软件11班</p>
			<p>报告：亮点 移动端通用 轮播图  鼠标指示放大效果 </p>
		</div>
	</body>
</html>
